import {init} from 'snabbdom/init'
import {classModule} from 'snabbdom/modules/class'
import {propsModule} from 'snabbdom/modules/props'
import {styleModule} from 'snabbdom/modules/style'
import {eventListenersModule} from 'snabbdom/modules/eventlisteners'
import {h} from 'snabbdom/h' // helper function for creating vnodes
import myH from '../pagkage/h';

function hFunctionMain() {
    /******************************************官方案例**************************************************************/

    /*const container = document.getElementById('container')
    const patch = init([ // Init patch function with chosen modules
        classModule, // makes it easy to toggle classes
        propsModule, // for setting properties on DOM elements
        styleModule, // handles styling on elements with support for animations
        eventListenersModule, // attaches event listeners
    ])
    const vnode = h('div#container.two.classes', {on: {click: () => {}}}, [
        h('span', {style: {fontWeight: 'bold'}}, 'This is bold'),
        ' and this is just normal text',
        h('a', {props: {href: '/foo'}}, 'I\'ll take you places!')
    ])
    // Patch into empty DOM element – this modifies the DOM as a side effect
    patch(container, vnode)

    const newVnode = h('div#container.two.classes', {on: {click: () => {}}}, [
        h('span', {style: {fontWeight: 'normal', fontStyle: 'italic'}}, 'This is now italic type'),
        ' and this is still just normal text',
        h('a', {props: {href: '/bar'}}, 'I\'ll take you places!')
    ])
    // Second `patch` invocation
    patch(vnode, newVnode) // Snabbdom efficiently updates the old view to the new state*/

    /******************************************h函数**************************************************************/
    /*// 初始化patch函数
    const firstPatch = init([
        classModule,
        propsModule,
        styleModule,
        eventListenersModule
    ]);
    // h函数
    const firstVnode = h('a', {
        props: {
                    href: 'http://blog.canyuegongzi.xyz',
                    target: '_blank'
                }
            },
        '第一次测试函数');
    console.log(firstVnode);
    // patch函数
    const firstContainer = document.querySelector('#container');
    //
    firstPatch(firstContainer, firstVnode);*/
    /******************************************手写h函数**************************************************************/
    // 初始化patch函数
    const firstPatch = init([
        classModule,
        propsModule,
        styleModule,
        eventListenersModule
    ]);
    // h函数
    const firstVnode = myH('p', {
            props: {}
        },
        '手写h函数');
    console.log(firstVnode);
    // patch函数
    const firstContainer = document.querySelector('#container');
    //
    firstPatch(firstContainer, firstVnode);
}
export default hFunctionMain

